@charset "utf-8";
@import './modules/header';
@import './modules/footer';
section{
    width: 100%;
    background-color: #fafafa;
    min-height: 740px;
    margin-top: 0 auto;
    margin-top: 130px;
    .detail-top{
            height: 46px;
            background-color: #f5f5f5;
            p{
                width: 1263px;
                height: 46px;
                margin: 0 auto;
                line-height: 46px;
                color: #666666;
                font-weight: bold;
            }
    }
    .detail-head{
        height: 664px;
        width: 100%;
        background-color: white;
        .detail-cent{
            width: 1203px;
            padding:0 30px;
            margin: 0 auto;
            height: 100%;
            display: flex;
            align-items: center;
            .cent-left{
                    width: 450px;
                    height: 600px;
                    position: relative;
                a{
                    display: block;
                    width: 450px;
                    height: 450px;
                    position: relative;
                    .a-img{
                        width: 100%;
                        height: 450px;
                    }
                    .bigimg-span{
                        position: absolute;
                        top:0;
                        left: 0;
                        width: 225px;
                        height: 225px;
                        border: none;
                        display: none;
                        background-color: rgba($color: #dd5a5a, $alpha: 0.3);
                    }
                  
                }
                .span-s{
                        width: 78px;
                        height: 78px;
                        margin:0 3px;
                        margin-top: 3px;
                        border: 1px solid #e0e0e0;
                        display: inline-block;
                    
                }
                .ac{
                    border: 1px solid #e32332;
                }
                
            }
           .cent-right{
               width: 692px;
               height: 600px;
               margin-left: 30px;
               p{
                   height: 100px;
                   padding-top: 30px;
                   font-size:26px ;
                   color: #474747;
                   span{
                       font-size: 18px;
                       color: #666666;
                   }
               }
               .right-price{
                   width: 692px;
                   height: 93px;
                   border-top:1px solid #efefef;
                   border-bottom: 1px solid #efefef;
                   line-height: 93px;
                   font-size: 28px;
                   color: #e90404;
               }
               .information{
                   width: 692px;
                   height: 185px;
                   display: flex;
                   flex-direction: column;
                   justify-content: space-around;
                   div{
                       font-size: 18px;
                       color: #9a9a9a;
                       .i-span{
                           padding: 0 100px;
                       }
                       .btn-s-span{
                           display: inline-block;
                           padding-right: 100px;
                       }
                       .span-xl{
                           display: inline-block;
                           width: 44px;
                           height: 27px;
                           border: 1px solid #e0e0e0;
                           margin: 0 3px;
                           text-align: center;
                           line-height: 27px;
                       }
                       .bord{
                           border: 1px solid #e90404;
                       }
                       .num-i{
                           width: 75px;
                           height: 22px;
                           display:inline-block;
                           margin-left: 100px;
                           border: 1px solid #e0e0e0;
                        
                       }
                       &>div{
                            display: inline-block;
                        b{
                            display: inline-block;
                            width: 25px;
                            height: 23px;
                            text-align: center;
                            line-height: 22px;
                            font-style: normal;
                           }
                        .a-i{
                            border: 1px solid #e0e0e0 ;
                            border-right: none;
                        }
                        .a-m{
                            border: 1px solid #e0e0e0 ;
                            border-left: none;
                        }
                        .a-n{
                            border: 1px solid #e0e0e0 ;
                            border-left: none;
                            border-right: none;
                        }
                        .a-i:hover,.a-m:hover{
                             background-color: #f0f0f0;
                          }
                       }
                      
                   }
               }
               .btn-goshop{
                   width: 692px;
                   height: 192px;
                   display: flex;
                   align-items: center;
                   justify-content: center;
                   div{
                       width: 260px;
                       height: 66px;
                       margin:5px;
                   }
                   .btn-a{
                      background-color: #e32332;
                      text-align: center;
                      line-height: 66px;
                      color: white;
                      font-size: 24px;
                   }
                   .btn-b{
                       border: 1px solid  #e32332;
                       text-align: center;
                       line-height: 66px;
                       color: #e32332;
                       font-size: 24px;
                   }
                   div:hover{
                       background-color: #cc0000;
                       color: white;
                   }
               }
           }
           .zoom{
               display: none;
               position: relative;
               z-index: 900;
               position: relative;
               .bigimg{

                   width: 450px;
                   height: 450px;
                   overflow: hidden;
                   position: absolute;
                   left: 460px;
                   top:-531px;
                   background-color: palegoldenrod;
                   img{
                       position: absolute;
                       left: -0px;
                       top:0px;
                       width: 900px;
                       height: 900px;
                   }
               }
           }
        }
    }
    .detail-foot{
        width: 1063px;
        min-height: 92px;
        margin: 0 auto;
        margin-top: 10px;
        display: flex;
        justify-content: space-around;
        .mb-love{
            width: 206px;
            background-color: white;
            height: 74px;
            .mb-top{
                margin: 0 15px;
                width: 176px;
                height: 74px;
                border-bottom: 1px solid #e0e0e0;
                color: #e0e0e0;
                font-size: 18px;
                text-align: center;
                line-height: 74px;
            }
            .next2{
                width: 206px;
                height: 250px;
                background-color: white;
                img{
                    width: 204px;
                    height: 206px;
                }
                p{
                    font-size: 12px;
                    color: #999999;
                    text-align: center;
                    span{
                        color: #e90404;
                    }
                }
            }
            .next2:hover{
                width: 204px;
                border: 1px solid #e90404;
            }
        }
        .shop-information{
            width: 790px;
            min-height: 1100px;
            .top-shop {
                width: 790px;
                height: 74px;
                background-color: white;
                display: flex;
                align-items: center;
                span{
                    display: inline-block;
                    height: 30px;
                    width: 210px;  
                    text-align: center; 
                    font-size: 24px;
                }
                .bor-c{
                    border-right: 1px solid #e0e0e0;
                    color: #ea1c04;
                }
                .cor-b:hover{
                    color: #ea1c04;
                }
            }

            img{
                width: 790px;
            
            }
        }
    }
}
.home-btn{
    // display: none;
    width: 65px;
    height: 65px;
    background-color:white;
    position: fixed;
    right: 10px;
    top:530px;
    a{
        padding-top: 10px;
        display: block;
        width: 65px;
        height: 55px;
        font-size: 16px;
        text-align: center;
        color: #999999;
    }
    a:hover{
        color: #eb1c04;
    }
}